<template>
  <div class="timerInfo">
    <timer
      class="timeItem"
      :list="yearList"
      ref="year"
      title="年"
      :disabled="disabled"
      :chosedData="yearChosed"
      @changeTime="changeTime"
    />
    <timer
      class="timeItem"
      :list="monthList"
      ref="month"
      title="月"
      :disabled="disabled"
      :chosedData="monthChosed"
      @changeTime="changeTime"
    />
    <timer
      class="timeItem"
      :list="weekList"
      ref="week"
      title="周"
      :disabled="disabled"
      :chosedData="weekChosed"
      @selectWeek="selectWeek"
      @changeTime="changeTime"
    />
    <timer
      class="timeItem"
      :list="dayList"
      ref="day"
      title="日"
      :disabled="disabled"
      :chosedData="dayChosed"
      @selectDay="selectDay"
      @changeTime="changeTime"
    />
    <timer
      class="timeItem"
      :list="hourList"
      ref="hour"
      title="时"
      :disabled="disabled"
      :chosedData="hourChosed"
      @changeTime="changeTime"
    />
    <timer
      class="timeItem"
      :list="minuteList"
      ref="minute"
      title="分"
      :disabled="disabled"
      :chosedData="minuteChosed"
      @changeTime="changeTime"
    />
    <div class="lastRunningTime">
      <span>最近运行时间：</span>
      <el-input
        type="textarea"
        :rows="6"
        placeholder="最终运行时间"
        v-model="runTime"
        readonly
      >
      </el-input>
    </div>
  </div>
</template>

<script>
import { getTriggerTime } from "@/api/productionPlan/maintenancePlan.js";
import timer from "./timer.vue";
export default {
  props: {
    cronTask: {
      type: Object,
      default: () => {
        return {};
      },
    },
    disabled: {
      type: Boolean,
      default: false,
    },
  },
  components: {
    timer,
  },
  data() {
    return {
      minuteList:[0,1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20,
        21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59],
      hourList: [
        0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19,
        20, 21, 22, 23,
      ],
      dayList: [
        1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20,
        21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31,
      ],
      monthList: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
      weekList: [1, 2, 3, 4, 5, 6, 7],
      yearList: [
        2021, 2022, 2023, 2024, 2025, 2026, 2027, 2028, 2029, 2030, 2031, 2032,
        2033, 2034, 2035, 2036, 2037, 2038, 2039, 2040,
      ],
      minuteChosed:[],
      hourChosed: [],
      dayChosed: [],
      monthChosed: [],
      weekChosed: [],
      yearChosed: [],
      runTime: "",
    };
  },
  watch: {
    cronTask: {
      handler(val) {
        this.init(val);
      },
    },
  },
  created() {
    this.init(this.cronTask);
  },
  methods: {
    init(val) {
      this.minuteChosed = val.mins
        ? this.arrRequire(val.mins.split(","))
        : ["0"];
      this.hourChosed = val.hours
        ? this.arrRequire(val.hours.split(","))
        : ["8"];
      this.dayChosed = val.days ? this.arrRequire(val.days.split(",")) : [];
      this.monthChosed = val.months
        ? this.arrRequire(val.months.split(","))
        : [];
      this.yearChosed = val.years ? this.arrRequire(val.years.split(",")) : [];
      this.weekChosed = val.weeks ? this.arrRequire(val.weeks.split(",")) : [];
      const data = {
        mins:val.mins,
        hours: val.hours,
        days: val.days,
        months: val.months,
        years: val.years,
        weeks: val.weeks,
      };
      this.getRecentTime(data);
    },
    selectDay() {
      this.$refs.week.clearCheck();
    },
    selectWeek() {
      this.$refs.day.clearCheck();
    },
    //去重
    arrRequire(data) {
      let result = [...new Set(data)];
      return result;
    },
    //获取选中时间
    getTimeInfo() {
      const obj = {};
      obj.mins = this.$refs.minute.getCheckedData();
      obj.hours = this.$refs.hour.getCheckedData();
      obj.days = this.$refs.day.getCheckedData();
      obj.months = this.$refs.month.getCheckedData();
      obj.weeks = this.$refs.week.getCheckedData();
      obj.years = this.$refs.year.getCheckedData();
      let str = obj.mins + obj.hours + obj.days + obj.months + obj.weeks + obj.years;
      if (str == "") {
        throw "定时器信息不能为空";
      } else {
        return obj;
      }
    },
    changeTime() {
      this.getRecentTime();
    },
    //获取最近执行时间
    getRecentTime(data) {
      try {
        let params = {};
        if (data) {
          params = data;
        } else {
          params = this.getTimeInfo();
        }
        getTriggerTime(params).then((res) => {
          this.runTime = res.data.join("\n");
        });
      } catch (error) {
        this.$message.warning(error);
        this.runTime = "";
      }
    },
  },
};
</script>

<style lang="less" scoped>
.timerInfo {
  width: 100%;
  height: 100%;
  // display: flex;
  // flex-wrap: wrap;
  .timeItem {
    text-align: left;
    width:100%;
    height: 100%;
  }
  .lastRunningTime{
    text-align: left;
    width: 50%;
  }
}
</style>